@charset "UTF-8";

html {
	font-size: 20px;
}
@media only screen and (min-width:320px) {
	html {
		font-size: 14px !important;
	}
}
@media only screen and (min-width:360px) {
	html {
		font-size: 15px !important;
	}
}
@media only screen and (min-width:375px) {
	html {
		font-size: 17px !important;
	}
}

@media only screen and (min-width:401px) {
	html {
		font-size: 25px !important;
	}
}
@media only screen and (min-width:411px) {
	html {
		font-size: 19px !important;
	}
}
@media only screen and (min-width:414px) {
	html {
		font-size: 22px !important;
	}
}

@media only screen and (min-width:428px) {
	html {
		font-size: 26.75px !important;
	}
}

@media only screen and (min-width:481px) {
	html {
		font-size: 30px !important;
	}
}

@media only screen and (min-width:569px) {
	html {
		font-size: 35px !important;
	}
}

@media only screen and (min-width:641px) {
	html {
		font-size: 40px !important;
	}
}

html,
body {
	padding: 0;
	margin: 0;
	/* background: rgb(49, 6, 140); */
	height: 100%;
}

p,
li,
b,
span,
div,
strong,
h1,
h2,
h3,
h4,
h5,
h6,
a,
ul {
	margin: 0;
	padding: 0;
	text-decoration: none;
	list-style: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.box {
	width: 16rem;
	height: 16rem;
	position: relative;
	margin: 0 auto;
	margin-top: 25%;
	/* margin-top: 5em; */

	
}

.box .outer {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 1;
	top: -0.5rem;
	left: 0;
	margin: 0 auto;
	right: 0;
	text-align: center;
	transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
}

.box .outer img {
	width: 100%;
}

.box .inner {
	position: relative;
	width: 6rem;
	height: 6rem;
	left: 50%;
	top: 45%;
	margin-left: 0;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	z-index: 2;
	/* background-image: url(../images/arrow.png); */
	background-image: url(../images/btn.png?v1.1.1);
	background-size: auto 6rem;
	    background-repeat: no-repeat;
}

.box .inner.start:active {
	-webkit-transform: translate(-50%, -50%) scale(.95);
	-moz-transform: translate(-50%, -50%) scale(.95);
	-ms-transform: translate(-50%, -50%) scale(.95);
	-o-transform: translate(-50%, -50%) scale(.95);
	transform: translate(-50%, -50%) scale(.95);
}

.box .inner.start {
	background-position: 0 0;
}

.box .inner.no-start {
	background-position: -5rem 0;
}

.box .inner.completed {
	background-position: -10rem 0;
}


.space {
	height: 12px;
}
ul,li{
 list-style: none
 }
 .scroll {
	 height:30px;/*显示多少li*/
	 width: 85%;
	 max-width:640px;
	 background:none;
	 overflow:hidden;
	 color: #000;
	 position: relative;
	 bottom: 22%;
	 margin:0 auto;
	 left:0;
	 right:0;
 }
 .scroll ul {
	 width:100%;
	 position:absolute;
	 left:0;
	 top:0;
 }
 .scroll span {
 	font-size:14px;
 	height:30px;
 	/*color:#D83E21;*/
 }
 .scroll li {
 	width: 100%;
 	height:30px;
 	line-height:30px;
	text-align: left;
 }
 .maintitle{
	 text-align: center;
 }